<!DOCTYPE html>
<#assign ctx=Session.basePath>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>船舶列表</title>
    <link href="${ctx}/easyui/themes/bootstrap/easyui.css" rel="stylesheet" />
    <link href="${ctx}/easyui/themes/icon.css" rel="stylesheet" />
    <link href="${ctx}/inspiniain/font-awesome/css/font-awesome.css" rel="stylesheet">
    <script src="${ctx}/js/jquery-1.12.2.min.js"></script>
    <script src="${ctx}/easyui/jquery.easyui.min.js"></script>
    <script src="${ctx}/easyui/locale/easyui-lang-zh_CN.js"></script>
    <script>
        var company ='<#if company??>${company}<#else></#if>';
    </script>
</head>
<body>

<div id="tb" style="padding:5px;height:auto">
    <div>
        船舶名称:<input id="shipname" class="easyui-text" style="width:100px">
        <a href="#" class="easyui-linkbutton btn-search" iconCls="icon-search" style="width: 70px;">查找</a>
    </div>
</div>

<table id="dg"
       data-options="rownumbers:true,singleSelect:true,pagination:true,url:'${ctx}<#if company??>/manage/map/company/cyxShip/ajax/list<#else>/manage/map/cyxShip/ajax/list</#if>',method:'post',toolbar:'#tb'">
    <thead>
    <tr>
        <th data-options="field:'shipname',width:100">船舶名称</th>
        <#--<th data-options="field:'shipimei',width:150">IMEI</th>-->
        <#--<th data-options="field:'postime',width:130">时间</th>-->
        <th data-options="field:'position',width:100,align:'center'">追踪</th>
    </tr>
    </thead>
</table>
<script type="text/javascript">
    $(function(){
        var pager = $('#dg').datagrid({
            fitColumns:true,
            fit: true,
            loadFilter: function(data){
                if(data != null && data.rows != null){
                    for(var i = 0; i < data.rows.length; i++){
                        var record = data.rows[i];
                        var lon = record.lon;
                        var lat = record.lat;
                        var position = "<a href='#' onclick='locationMap(\""+record.lon+"\",\""+record.lat+"\",\""+record.shipimei+"\",\""+record.shipname+"\",\""+record.course+"\")'><i style='font-size:20px;' class='fa fa-map-marker' aria-hidden='true'></i></a>";
                        record.position = position;
                    }
                }
                return data;
            }
        });	// get the pager of datagrid

       var page=$('#dg').datagrid('getPager');
        page.pagination({
            layout:['first','prev','next','last','refresh'],
            showRefresh:true
        });

        $(".btn-search").click(function () {
            $('#dg').datagrid("load",{
                shipname : $("#shipname").val()
            })
        })

    })

    function locationMap(lon,lat,shipimei,shipname,course) {
        if(lon!='null'&&lat!='null')
        {
           var trackShip={
               trackId:shipimei,
               type:"cyx"
           }
            window.parent.locMap(lon,lat,trackShip,shipname,course);
        }else{
            window.parent.layer.alert('无法追踪该船舶');
        }

    }
</script>


</body>
</html>